/* pages/clintEnd/yuyue/yuyue.wxss */

page {
    background: -webkit-linear-gradient(top, rgb(244, 157, 4), #FACF94, white);
}

.booking-record {
    .booking-item {
        margin: 20rpx;
        background-image: url(https://ts1.cn.mm.bing.net/th/id/R-C.c3e6d01ce83cb9c68ed6f4b9eadeb943?rik=1U8v7Fk%2fC3vsYg&riu=http%3a%2f%2f5b0988e595225.cdn.sohucs.com%2fimages%2f20180724%2f1b4ca8960e1341cb810624a37b3ddfa3.jpeg&ehk=8oZmHo749t8y%2foFCnXOxcOINZWq259IGiwhHfvwQxeU%3d&risl=&pid=ImgRaw&r=0);
        background-repeat: no-repeat;
        background-size: cover;
        display: flex;
        /* 使用 Flexbox 布局 */
        align-items: center;
        /* 垂直居中 */
        justify-content: space-between;
        /* 项目间平均分布 */
        padding: 10px;
        margin-bottom: 10px;
        background-color: #f0f0f0;
        border-radius: 10px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);

        .item-info {
            margin-bottom: 5px;
            font-size: 14px;
            color: rgb(15, 139, 15);
            flex: 1;

            /* 撑满剩余空间 */
            .item-item {
                margin-bottom: 5px;
            }

            .item-phone {
                margin-bottom: 5px;
            }
        }

        .cancel-btn {
            background-color: #ff6347;
            color: #fff;
            padding: 10px 15px;
            border-radius: 20px;
            cursor: pointer;
            font-size: 15px;
            font-weight: bold;
            /* 设置字体加粗 */
        }

        /* 悬停时的按钮文字样式 */
        .cancel-btn:hover {
            background-color: #dc143c;
            text-decoration: underline;
            /* 给文字添加下划线 */
        }
    }
}